/*
 * @Author: 2112778581 2112778581@qq.com
 * @Date: 2024-01-10 13:48:09
 * @LastEditors: 2112778581 2112778581@qq.com
 * @LastEditTime: 2024-01-10 14:15:52
 * @FilePath: \my-sjksh\3d\01-webgl\app.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
// 画单色三角形

const canvas = document.querySelector('canvas');
const gl = canvas.getContext('webgl');


const vertex = `
    attribute vec2 position;
    void main() {
        gl_PointSize = 1.0;
    
        gl_Position = vec4(position, 1.0, 1.0);
    }
`;
const fragment = `
    precision mediump float;
    void main() {
        gl_FragColor = vec4(0.0,0.0,1.0, 1.0);
    }
`;
const vertexShader = gl.createShader(gl.VERTEX_SHADER)
gl.shaderSource(vertexShader, vertex)
gl.compileShader(vertexShader)


const framentShader = gl.createShader(gl.FRAGMENT_SHADER)
gl.shaderSource(framentShader, fragment)
gl.compileShader(framentShader)

const program = gl.createProgram()
gl.attachShader(program, vertexShader)
gl.attachShader(program, framentShader)

gl.linkProgram(program)
gl.useProgram(program)


const points = new Float32Array([
    -1,-1,
    0,1,
    1,-1
])

const bufferId = gl.createBuffer()
gl.bindBuffer(gl.ARRAY_BUFFER, bufferId)
gl.bufferData(gl.ARRAY_BUFFER, points, gl.STATIC_DRAW)


const vPosition = gl.getAttribLocation(program, 'position')
gl.vertexAttribPointer(vPosition, 2, gl.FLOAT, false, 0, 0)
gl.enableVertexAttribArray(vPosition);

gl.clear(gl.COLOR_BUFFER_BIT)
gl.drawArrays(gl.TRIANGLES, 0, points.length / 2)